Warna pada Tailwind

Untuk membuat warna mudah di maintain dan tersentralisasi, tailwind sudah menyediakan sebuah konfigurasi untuk menyimpan palet warna.

1. Edit tailwind.config.js untuk memodifikasi atau menambah warna baru.

   theme: {
    extend: {
      colors: {
        primary: '#00529C',
        'primary-accent': '#004080',
        secondary: '#0095E8',
        danger: '#EC1E1E',
        success: '#1CC11C',
        warning: '#FF6100',
        default: '#5C5F62',
      },
    },
   },

2. Untuk menggunakannya sama seperti penggunaan warna bawaan dari tailwind.

   .button.primary {
     @apply text-white bg-primary hover:bg-primary-accent;
   }
   
   .button.success {
     @apply text-white bg-success;
   }
   
   .button.default {
     @apply text-white bg-default;
   }